<template>
  <div class="store-container">
    <city-header :title="title" class="store-header"></city-header>
    <!-- <router-link to="/store/map">
      <span class="map">地图</span>
    </router-link>-->
    <router-link to="/store/map" class="map">地图</router-link>

    <!--下拉菜单-->
    <combo @change="getLocal" @getservice="getServices"></combo>

    <!--门店列表区域-->
    <storelist :local="local" :services="services"></storelist>
  </div>
</template>

<script>
import cityHeader from "../city/components/CityHeader.vue";
import combo from "../subcomponents/combo.vue";
import storelist from "../subcomponents/storelist.vue";

export default {
  data() {
    return {
      title: "门店列表",
      local: "",
      services: ""
    };
  },
  created() {},
  mounted() {},
  methods: {
    getLocal(local) {
      this.local = local;
    },
    getServices(services) {
      this.services = services;
      //console.log(this.services);
    }
  },
  components: {
    cityHeader,
    combo,
    storelist
  }
};
</script>

<style lang="scss" scoped>
* {
  font-size: 0;
  padding: 0;
  margin: 0;
}
.store-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  line-height: 0;
  //overflow: hidden;
  .store-header {
    position: relative;
  }
  .map {
    z-index: 1;
    line-height: 14px;
    font-size: 14px;
    color: #ffffff;
    top: 16px;
    right: 16px;
    // top: 40px;
    position: absolute;
  }
}
html,
body {
  height: 100%;
}
.appcontainer[data-v-ec61c590] {
  padding: 0;
  height: 100%;
}
</style>